<template>
  <div class="container-content detail">
    <div class="detail-container">
      <el-descriptions class="detail-descriptions" :column="1" border colon>
        <el-descriptions-item>
          <template slot="label"> 票据号 </template>
          {{ formObject.billNo || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 票据类型 </template>
          {{ formObject.billType || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 签发日 </template>
          {{ formObject.issuanceTime || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 币别 </template>
          {{ formObject.kingBaseCurrencyId || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 结算状态 </template>
          {{ handleSettlementStatus(formObject.settlementStatus) }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 付款银行账户地址 </template>
          {{ formObject.payBankAddress || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">付款银行账户名称 </template>
          {{ formObject.payBankName || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 收款银行 </template>
          {{ formObject.receiptBank || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 收款银行地址 </template>
          {{ formObject.receiptBankAddress || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 收款单位Id </template>
          {{ formObject.receiptDeptId || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 承兑人 </template>
          {{ formObject.acceptanceBankId || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 票据流水号 </template>
          {{ formObject.billSerialNo || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 数据状态 </template>
          {{ handleDataStatus(formObject.dataStatus) }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 到期日 </template>
          {{ formObject.dueTime || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 票面金额 </template>
          {{ formObject.faceAmount || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 付款银行账号 </template>
          {{ formObject.payBankAccount || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 付款银行Id </template>
          {{ formObject.payBankId || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 付款组织Id </template>
          {{ formObject.payDeptId || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 收款银行账号 </template>
          {{ formObject.receiptBankAccount || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 收款银行名称 </template>
          {{ formObject.receiptBankName || "--" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 付款单位类型 </template>
          {{ formObject.receiptDeptType || "--" }}
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
</template>
<script>
import { getDetail } from "@/api/finance/receipt";
import { handleDataStatus, handleSettlementStatus } from "../../common";
export default {
  props: ["rowId"],
  data() {
    return {
      formObject: {
        acceptanceBankId: "",
        billNo: "",
        billSerialNo: "",
        billType: "",
        createBy: "",
        createTime: "",
        dataStatus: 0,
        dueTime: "",
        faceAmount: "",
        faceRate: "",
        issuanceTime: "",
        kingBaseCurrencyId: "",
        params: {},
        payBankAccount: "",
        payBankAddress: "",
        payBankId: "",
        payBankName: "",
        payDeptId: "",
        receiptBank: "",
        receiptBankAccount: "",
        receiptBankAddress: "",
        receiptBankName: "",
        receiptDeptId: "",
        receiptDeptType: "",
        remark: "",
        searchValue: "",
        settlementStatus: 0,
        updateBy: "",
        updateTime: "",
      },
    };
  },
  methods: {
    getData(id) {
      getDetail(id).then((res) => {
        if (res.code === 200) {
          this.formObject = res.data.kingFinancePayBillEntity;
        }
      });
    },
    handleDataStatus(type) {
      return handleDataStatus(type);
    },
    handleSettlementStatus(type) {
      return handleSettlementStatus(type);
    },
  },
  created() {
    this.getData(this.rowId);
  },
};
</script>
<style lang="scss" scoped>
.detail-bg {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding-left: 10px;
  padding-right: 10px;
}
.detail {
  background: #f1f4f5;
  height: 100%;
}
.detail-container {
  width: 98%;
  margin: 1%;
  background: #fff;
  z-index: 3;
  position: relative;
  border-radius: 10px;
  padding: 20px;
}
.detail-descriptions {
  padding-left: 40px;
  padding-right: 40px;
}
::v-deep .el-descriptions-item__label.is-bordered-label {
  width: 20%;
}
</style>
